<template>
  <Screen v-if="screening" />
  <Editor v-show="!screening && _isPC" />
  <Mobile v-show="!screening && !_isPC" />
</template>

<script lang="ts" setup>
"home";
import { onMounted } from "vue";
import { storeToRefs } from "pinia";
import {
  useScreenStore,
  useMainStore,
  useSnapshotStore,
  useSlidesStore,
} from "@/store";
import { LOCALSTORAGE_KEY_DISCARDED_DB } from "@/configs/storage";
import { deleteDiscardedDB } from "@/utils/database";
import { isPC } from "@/utils/common";
import { useRoute } from "vue-router";
import { getScene } from "@/api/facility/index";
const route = useRoute();
// import Editor from '../Editor/index.vue'
import Editor from "./Editor/index.vue";
import Screen from "./Screen/index.vue";
import Mobile from "./Mobile/index.vue";
import { slide } from "@/mocks/slides";
import { getprogram } from "@/api/advertising";

const _isPC = isPC();

const mainStore = useMainStore();
const snapshotStore = useSnapshotStore();
const { databaseId } = storeToRefs(mainStore);
const { screening } = storeToRefs(useScreenStore());
const { slides, currentSlide } = storeToRefs(useSlidesStore()); //这个是菠萝里面存的数据
if (process.env.NODE_ENV === "production") {
  window.onbeforeunload = () => false;
}
let res = await getprogram(route.query.id ?route.query.id : localStorage.getItem('id'));
    // name.value = res.data.data.programName;
    // programId.value = res.data.data.id
    mainStore.canvasHeight1 = res.data.data.longResolution
    mainStore.canvasWidth1 = res.data.data.wideResolution
onMounted(async () => { 
  // 编辑回显数据
  // let res = await getScene(route.query.id?route.query.id : localStorage.getItem('val'));


  // if (res.data.code==1) {
    
  //   slides.value = res.data.data.map((item: any) => {
  //     return JSON.parse(item.content);
  //   });

  // }

//   slides.value = slides.value.map((v) => {
//   const slide = JSON.parse(v);
//   const color = slide.background.color;

//   const regex = /rgba\((\d+),(\d+),(\d+),(\d+(?:\.\d+)?)\)/;
//   const match = color.match(regex);

//   if (match) {
//     const r = parseInt(match[1]);
//     const g = parseInt(match[2]);
//     const b = parseInt(match[3]);
//     const a = parseFloat(match[4]);

//     slide.background.color = '#' + ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);
//   }

//   return JSON.stringify(slide);
// });
  
  // 如果slides为空就给赋值默认的数据
  if (slides.value.length == 0) {
    slides.value = slide
  }
  await deleteDiscardedDB();
  snapshotStore.initSnapshotDatabase();
  mainStore.setAvailableFonts();
});

// 应用注销时向 localStorage 中记录下本次 indexedDB 的数据库ID，用于之后清除数据库
window.addEventListener("unload", () => {
  const discardedDB = localStorage.getItem(LOCALSTORAGE_KEY_DISCARDED_DB);
  const discardedDBList: string[] = discardedDB ? JSON.parse(discardedDB) : [];

  discardedDBList.push(databaseId.value);

  const newDiscardedDB = JSON.stringify(discardedDBList);
  localStorage.setItem(LOCALSTORAGE_KEY_DISCARDED_DB, newDiscardedDB);
});
</script>

<style lang="scss">
#app {

  height: 100%;
}
</style>
